import {
  getKdata,
  searchBlocksInfo
} from "@/config/apiServe/new-rpc.js";
import {
  formatTime,
  nFormatter
} from "@/utils/filters.js";
const echarts = require("echarts");
require("echarts/lib/chart/line");
require("echarts/lib/component/tooltip");
export default {
  props: {
    showY: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      active: 0,
      lineActive: 2,
      option: {},
      xData: [],
      yData: [],
      yLabel: [],
      title: "BTY燃烧情况",
      showLabel: "燃烧统计"
    };
  },
  mounted() {
    this.changeLine(0);
  },
  methods: {
    drawLine() {
      let coinLine = echarts.init(document.getElementById("coinLine"));
      this.option = {
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "cross",
            label: {
              backgroundColor: "#6a7985"
            }
          },
          formatter: item => {
            let value =
              this.active === 0 ? item[0].value : `$ ${item[0].value}`;
            return `${item[0].axisValue}<br>${this.showLabel}：${value}`;
          }
        },
        grid: {
          top: "10px",
          left: "0",
          right: "30px",
          bottom: "0",
          containLabel: true
        },
        xAxis: [{
          type: "category",
          boundaryGap: false,
          data: this.xData,
          axisLabel: {
            margin: 10,
            show: true,
            textStyle: {
              color: "#516379" //这里用参数代替了
            }
          },
          axisTick: {
            show: false
          },
          axisLine: {
            show: false
          }
        }],
        yAxis: [{
          type: "value",
          axisLabel: {
            margin: 20,
            show: true,
            textStyle: {
              color: "#516379" //这里用参数代替了
            },
            formatter: item => {
              return nFormatter(item)
            }
          },
          axisTick: {
            show: false
          },
          axisLine: {
            show: false
          },
          splitLine: {
            lineStyle: {
              // 使用深浅的间隔色
              color: ["#EAEAEA"],
              type: "solid"
            }
          }
        }],
        series: [{
          name: this.showLabel,
          type: "line",
          stack: "总量",
          smooth: true,
          areaStyle: {
            color: "#B9CEFF"
          },
          lineStyle: {
            normal: {
              color: "#2458CD"
            }
          },
          data: this.yData
        }]
      };
      coinLine.setOption(this.option);
    },
    changeLine(type) {
      this.active = type;
      this.lineActive = 2;
      if (type === 1) {
        this.title = "BTY价格行情";
        this.getBTYPrice();
      } else {
        this.title = "BTY燃烧情况";
        this.getBTYFee();
      }
    },
    changeLineRange(range) {
      this.lineActive = range;
      let format = "MN1";
      switch (range) {
        case 0:
          format = "D1";
          break;
        case 1:
          format = "W1";
          break;
        case 2:
          format = "MN1";
          break;
        default:
          break;
      }
      if (this.active === 1) this.getBTYPrice(format);
      else this.getBTYFee(format);
    },
    // 价格行情
    getBTYPrice(format = "MN1", range) {
      this.xData = [];
      this.yData = [];
      getKdata(format, range).then(res => {
        res.main.x.forEach(item => {
          this.xData.push(formatTime(item, "MM-dd"));
        });
        res.main.y.forEach(item => {
          this.yData.push(item[3]);
        });
        this.showLabel = "收盘价";
        let coinLine = echarts.init(document.getElementById("coinLine"));
        coinLine.dispose();
        this.drawLine();
      });
    },
    // 燃烧行情
    getBTYFee(format = "MN1") {
      this.xData = [];
      this.yData = [];
      this.showLabel = "燃烧统计";
      const now = new Date();
      let y = now.getFullYear();
      let m = now.getMonth();
      let d = now.getDate();
      let params = [];
      let num = 0;
      switch (format) {
        case "D1":
          while (num < 7) {
            let param = {
              page: {
                size: 1,
                number: 1
              },
              range: [{
                start: new Date(y, m, d).getTime() / 1000,
                key: "time"
              }],
              sort: [{
                ascending: true,
                key: "height"
              }]
            };
            if (d < 1) {
              let t = new Date(y, m, d);
              this.xData.unshift(`${t.getMonth() + 1}-${t.getDate()}`);
            } else this.xData.unshift(`${m + 1}-${d}`);
            params.push(param);
            d--;
            num++;
          }
          break;
        case "W1":
          while (num < 7) {
            let param = {
              page: {
                size: 1,
                number: 1
              },
              range: [{
                start: new Date(y, m, d).getTime() / 1000,
                key: "time"
              }],
              sort: [{
                ascending: true,
                key: "height"
              }]
            };
            if (d < 1) {
              let t = new Date(y, m, d);
              this.xData.unshift(`${t.getMonth() + 1}-${t.getDate()}`);
            } else this.xData.unshift(`${m + 1}-${d}`);
            params.push(param);
            d -= 7;
            num++;
          }
          break;
        case "MN1":
          while (num < 7) {
            let param = {
              page: {
                size: 1,
                number: 1
              },
              range: [{
                start: new Date(y, m).getTime() / 1000,
                key: "time"
              }],
              sort: [{
                ascending: true,
                key: "height"
              }]
            };
            if (m < 1) {
              let t = new Date(y, m, d);
              this.xData.unshift(`${t.getMonth() + 1}-1`);
            } else this.xData.unshift(`${m + 1}-1`);
            params.push(param);
            m--;
            num++;
          }
          break;
        default:
          break;
      }
      searchBlocksInfo(params).then(res => {
        if (res.error === null) {
          res.result.forEach(item => {
            this.yData.unshift(item[0].fee / 100000000);
          });
        }
        // 重绘
        let coinLine = echarts.init(document.getElementById("coinLine"));
        coinLine.dispose();
        this.drawLine();
      });
    }
  }
};